<template>
  <uv-overlay :show="overlayShow">
    <view class="warp">
      <view class="rect">
        <view class="title">温馨提示</view>
        <scroll-view scroll-y="true" style="max-height: 600rpx;">
          <view class="privacy-content">
            <view class="privacy-intro">
              欢迎您使用希尔顿酒店小程序（以下简称"本小程序"）。我们非常重视您的隐私与个人信息保护。本隐私协议将向您说明我们如何收集、使用、存储和保护您的个人信息。
            </view>

            <view class="privacy-section">
              <view class="section-title">信息收集</view>
              <view class="section-content">
                在您使用本小程序功能时，我们可能会收集您的姓名、联系方式、身份证件信息、支付信息、位置信息及住宿偏好等，以便为您提供预订、会员服务及个性化推荐。
              </view>
            </view>

            <view class="privacy-section">
              <view class="section-title">信息使用</view>
              <view class="section-content">
                收集的信息将用于账户管理、订单处理、客户服务、营销活动通知以及改善我们的服务体验。未经您同意，我们不会将您的个人信息用于本协议以外的用途。
              </view>
            </view>

            <view class="privacy-section">
              <view class="section-title">信息共享</view>
              <view class="section-content">
                我们承诺不会向第三方出售或泄露您的个人信息。仅在符合法律法规或经您授权的情况下，向必要的合作方提供信息，并确保其依法保护您的隐私。
              </view>
            </view>

            <view class="privacy-section">
              <view class="section-title">信息保护</view>
              <view class="section-content">
                我们采用合理的安全措施保护您的信息安全，包括数据加密、访问控制等技术手段，以防止数据泄露、损毁或被非法访问。
              </view>
            </view>

            <view class="privacy-section">
              <view class="section-title">您的权利</view>
              <view class="section-content">
                您有权访问、更正、删除您的个人信息，并可随时撤回授权。若有任何疑问，请通过小程序内客服与我们联系。
              </view>
            </view>

            <view class="privacy-footer">
              本隐私协议自您同意之日起生效。希尔顿酒店将不断优化隐私保护措施，确保您的信息安全。
            </view>
          </view>
        </scroll-view>
        <view class="btn">
          <button type="primary" style="width: 100%; background-color: #0F4C97;" @click="agree">我同意</button>
          <navigator target="miniProgram" open-type="exit">
            <view class="btn_reject" @click="disAgree">我不同意</view>
          </navigator>
        </view>
      </view>
    </view>
  </uv-overlay>
</template>

<script>
  import { mapState, mapMutations } from "vuex";
	export default {
    data () {
      return {
        overlayShow: true,
        homeUrl: "/pages/index/HiltonHotelPage",
      };
    },
    computed: {
      ...mapState(["agreePrivacy"]),
    },
    onLoad() {
      if (this.agreePrivacy) {
        uni.switchTab({ url: this.homeUrl });
      }
    },
    methods: {
      ...mapMutations(["setAgreePrivacy"]),
      agree() {
        this.setAgreePrivacy(true);
        uni.switchTab({ url: this.homeUrl });
      },
      disAgree() {
        this.setAgreePrivacy(false);
      }
    },
  }
</script>

<style lang="less" scoped>
.warp {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.title {
  font-weight: bold;
  text-align: center;
  padding-bottom: 30rpx;
  font-size: 32rpx;
}

.rect {
  width: 500rpx;
  padding: 40rpx;
  background-color: #fff;
  border-radius: 30rpx;
  position: relative;
  padding-bottom: 240rpx;
}
.btn {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 400rpx;
  bottom: 50rpx;
  padding-top: 40rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  .btn_reject {
    padding-top: 30rpx;
  }
}

.privacy-content {
  padding: 0 10rpx;
}

.privacy-intro {
  margin-bottom: 20rpx;
  text-align: justify;
  line-height: 40rpx;
  font-size: 24rpx;
}

.privacy-section {
  margin-bottom: 20rpx;
}

.section-title {
  font-weight: bold;
  margin-bottom: 8rpx;
  font-size: 28rpx;
}

.section-content {
  text-align: justify;
  font-size: 24rpx;
  line-height: 40rpx;
}

.privacy-footer {
  margin-top: 20rpx;
  text-align: justify;
  font-size: 24rpx;
  line-height: 40rpx;
}
</style>